<template>
	<view class="px-12 pt-12 pb-100">
		<view v-if="current==1">
			<template v-for="(item, index) in detail.tableData">
				<view class='bg-white p-15 round-8 mt-20' v-if="item.type=='input'">
					<text class="fw-600">{{item.field_title}}</text>
					<view class="bg-fa round-6 mt-6 p-12">
						<input :placeholder="item.placeholder||'请输入'" class="fs-14" v-model="form[item.field]" />
					</view>
				</view>
				
				<view class='bg-white p-15 round-8 mt-20' v-if="item.type=='textarea'">
					<text class="fw-600">{{item.field_title}}</text>
					<view class="bg-fa round-6 mt-6 p-12">
						<textarea :placeholder="item.placeholder||'请输入'" class="fs-14" v-model="form[item.field]" />
					</view>
				</view>
				
				<view class="bg-white p-15 round-8 mt-15" v-if="item.type=='radio'">
					<view class=" fs-15 ml-8 ">{{item.field_title}}</view>
					<view class=" p-10 round-8 mt-6 bg-fa"
						:class="form[item.field]==radioItem.value?'bg-blue text-white':'bg-white'"
						@click="form[item.field]=radioItem.value" v-for="(radioItem,radioIndex) in item.option">
						<text>{{radioItem.label}}</text>
					</view>
				</view>

				<view class="bg-white p-15 round-8 mt-15" v-if="item.type=='checkbox'">
					<view class=" fs-15 ml-8 ">{{item.field_title}}</view>
					<view class=" p-10 round-8 mt-6 bg-fa"
						:class="form[item.field].indexOf(checkboxItem.value)!=-1 ?'bg-blue text-white':'bg-white'"
						@click="select(checkboxItem,item.field)" v-for="(checkboxItem,checkboxIndex) in item.option">
						<text>{{checkboxItem.label}}</text>
					</view>
				</view>
			</template>
			<y-footer @success="submit" mode>{{sbumitText}}</y-footer>
		</view>
		<view v-else class="bg-white round-8 p-10 fs-14">
			{{content}}
			<view class="flex w-p-100 fs-13 gap-8 flex-x-flex-end mt-10">
				<view class="bg-29 flex flex-y-center px-12 py-4 gap-4 round-4" @click="reset">
					<text class="iconfont icon-fanhui"></text>
					重新生成
				</view>

				<view class="bg-29 flex px-12 py-4 flex-y-center gap-4 round-4" @click="copy()">
					<text class="iconfont icon-fuzhi-"></text>
					复制文案
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { computed, reactive, ref } from 'vue';
	import { onLoad } from '@dcloudio/uni-app'
	import { getAppDetail, util } from '@/api/app.js'
	import { $tool } from '@/utils';
	const current = ref(1)
	const form = ref({
		app_id: 0
	})
	const content = ref('')
	const detail = ref({
		points: 0
	})
	const sbumitText = computed(() => {
		if (detail.value.points == 0) {
			return '免费生成'
		}
		return '文案生成 消耗算力:' + detail.value.points
	})
	onLoad((option) => {
		if (option.id) {
			get({ id: option.id })
		} else {
			get({ type: 'oralCopy' })
		}
	})
	const get = (query) => {
		getAppDetail(query).then(res => {
			detail.value = res.data
			detail.value.tableData.forEach(item => {
				if (item.type == 'checkbox') {
					form.value[item.field] = []
				} else {
					form.value[item.field] = ''
				}
			})
		})
	}
	const submit = () => {
		if (!detail.value.id) {
			$tool.toast('应用不存在');
			return;
		}
		uni.showLoading({
			title: '生成中..'
		})
		form.value.app_id = detail.value.id
		util(form.value).then(res => {
			content.value = res.data
			current.value = 2
		})
	}

	const copy = () => {
		uni.setClipboardData({
			data: content.value
		})
	}

	const reset = () => {
		current.value = 1
		form.value = {
			title: '',
			size: 100
		}
	}
	const select = (e,field) => {
		const index = form.value[field].indexOf(e.value);
		if (index == -1) {
			form.value[field].push(e.value)
		} else {
			form.value[field].splice(index, 1)
		}
	}
</script>

<style>

</style>